<%@ page pageEncoding="UTF-8" %>
<%@ include file="../common/IncludeTop.jsp"%>

<script>
	jQuery(document).ready(function(){
		var elements1 = document.getElementsByName("yesBtn");
		for(var i=0;i<elements1.length;i++){
			elements1[i].style.display="none";
		}
		var elements2 = document.getElementsByName("noBtn");
		for(var i=0;i<elements2.length;i++){
			elements2[i].style.display="none";
		}
	});
</script>

<div id="BackLink">
	<a href="main">返回主菜单</a>
</div>

<div id="Catalog">

<div id="Cart">

<h2>购物车</h2>
	<form action="updateCartQuantities" method="post">
		<table>
			<tr>
				<th><b>宠物ID</b></th>
				<th><b>商品ID</b></th>
				<th><b>描述</b></th>
				<th><b>是否有货</b></th>
				<th><b>数量</b></th>
				<th><b>价格</b></th>
				<th><b>总价</b></th>
				<th>&nbsp;</th>
			</tr>

			<c:if test="${sessionScope.cart.numberOfItems == 0}">
				<tr>
					<td colspan="8"><i>您的购物车空空如也</i></td>
				</tr>
			</c:if>

			<c:forEach var="cartItem" items="${sessionScope.cart.cartItems}">
				<tr>
					<td>
						<a href="viewItem?itemId=${cartItem.item.itemId}">${cartItem.item.itemId}</a>
					</td>
					<td>
						<a href="viewProduct?productId=${cartItem.item.product.productId}">${cartItem.item.product.productId}</a>
					</td>
					<td>
						${cartItem.item.attribute1} ${cartItem.item.attribute2}
						${cartItem.item.attribute3} ${cartItem.item.attribute4}
						${cartItem.item.attribute5} ${cartItem.item.product.name}
					</td>
					<td>
						${cartItem.inStock}
					</td>
					<td>
						<input type="text" id="quantity" onblur="updateCart();" name="${cartItem.item.itemId}" value="${cartItem.quantity}" />
						<script type="text/javascript" src="${pageContext.request.contextPath}/js/updateCart.js"></script>
					</td>
					<td>
						<fmt:formatNumber value="${cartItem.item.listPrice}" pattern="¥#,##0.00" />
					</td>
					<td>
<%--					<fmt:formatNumber value="${cartItem.total}" pattern="$#,##0.00" />--%>
						<label id="total">¥${cartItem.total}</label>
					</td>
					<td>
						<a href="#" class="Button" name="removeBtn"
							onclick="this.style.display='none';
							this.nextElementSibling.style.display='inline';
							this.nextElementSibling.nextElementSibling.style.display='inline';"
						>移除</a>
						<a href="removeItemFromCart?workingItemId=${cartItem.item.itemId}" class="Button" name="yesBtn">&nbsp&nbsp√&nbsp&nbsp</a>
						<a href="#" class="Button" name="noBtn"
							onclick="this.style.display='none';
							this.previousElementSibling.style.display='none';
							this.previousElementSibling.previousElementSibling.style.display='inline';"
						>&nbsp&nbsp×&nbsp&nbsp</a>
					</td>
				</tr>
			</c:forEach>
<%--			<tr>--%>
<%--				<td colspan="7">--%>
<%--					<input type="submit" value="更新购物车"/>--%>
<%--				</td>--%>
<%--				<td>&nbsp;</td>--%>
<%--			</tr>--%>
		</table>
	</form>

		<c:if test="${sessionScope.cart.numberOfItems > 0}">
			<c:if test="${sessionScope.loginAccount==null}">
				<a href="signon" class="Button">点击结算</a>
			</c:if>
			<c:if test="${sessionScope.loginAccount!=null}">
				<a href="viewNewOrder" class="Button">点击结算</a>
			</c:if>
		</c:if>
</div>

	<div id="Separator">&nbsp;</div>

</div>

<%@ include file="../common/IncludeBottom.jsp"%>